<!--
 * @Descripttion: your project
 * @version: 1.0
 * @Author: hongweixun
 * @Date: 2022-05-31 08:24:47
 * @LastEditors: hongweixun
 * @LastEditTime: 2022-09-30 10:26:10
-->
<!--  请假放行页面  -->
<template>
  <div class="index-flex-box" id="index-flex-box">
    <van-tabs
      v-model:active="active"
      sticky
      animated
      swipeable
      @change="tabsChanged"
      color="#146AF7"
      line-width="20px"
      line-height="4px"
      title-inactive-color="#999"
      title-active-color="#146af7"
    >
      <van-tab title="今日考勤" name="1">
        <OneTabs ref="One"></OneTabs>
      </van-tab>
      <van-tab title="历史考勤" name="2">
        <SecondTabs ref="Second"></SecondTabs>
      </van-tab>
    </van-tabs>
  </div>
</template>
<script lang="ts" setup>
import { ref, reactive, onMounted, nextTick, onUnmounted } from 'vue'
import $util from '../util/util'
import { useStore } from 'vuex'
import { useRoute, useRouter } from 'vue-router'
import OneTabs from '../components/OneTabs.vue'
import SecondTabs from '../components/SecondTabs.vue'
import { Dialog, Toast } from 'vant'
const store = useStore()
const route = useRoute()
const router = useRouter()
const One = ref<any>(null)
const Second = ref<any>(null)
// tabs选中的标签
const active = ref<any>('1')
const tabsChanged = (val: any) => {
  if (Number(val) === 1) {
    One.value.init()
  } else {
    // if (Second.value.finished) {
    // alert(123123)
    Second.value.list = []
    Second.value.personQuery.page = 1
    Second.value.getHistoryList()
    // }
  }
  store.dispatch('setActive', val)
}

onMounted(async () => {
  // 8****************************
  active.value = store.state.active
  if (route.query.classId) {
    store.dispatch('setClassTree')
  } else {
    store.dispatch('setFacully')
  }
  // if (Number(route.query.isLogin) === 1) {
  //   setTimeout(() => {
  //     window.sessionStorage.removeItem('loginForm')
  //     window.sessionStorage.removeItem('accessToken')
  //     router.replace('/login')
  //   }, 300000)
  // }
})
</script>
<style lang="scss" scoped>
.index-flex-box {
  position: relative;
  overflow: hidden;
}
</style>
